<% set_page_title(:projects) %>

<%= start_pending_app_tour_tag("projects/index") %>

<%= turbo_frame_tag 'project_time_track_memberships' do %>
<% end %>

<div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-3 mb-6">
  <h2 class="font-semibold text-3xl text-base-content">
    <%= Project.model_name.human(count: 2) %>
  </h2>
  <%= link_to new_project_path,
      class: "btn btn-primary",
      data: { turbo_frame: 'project_form' } do %>
      <%= icon_for(:add_entry) %>
      <%= "#{t('actions.create')} #{Project.model_name.human.downcase}" %>
    <% end %>
</div>

<%= turbo_frame_tag 'project_form', src: (params[:open_form] ? params[:form_project_id] ? edit_project_path(params[:form_project_id]) : new_project_path : nil) do %>
<% end %>

<%= turbo_frame_tag 'projects', class: "tour--projects-list" do %>
  <div class="flex flex-col gap-4 lg:gap-8 flex-wrap justify-stretch" id="projects-list">
    <% if @projects.count.zero? %>
      <%= render EmptyListComponent.new(
        message: t("zero_records", resource_name: Project.model_name.human.pluralize.downcase),
        action: {
          url: new_project_path,
          text: t('click_here_to_create_one'),
          extra_options: { data: { turbo_frame: 'project_form' } }
        })
      %>
    <% else %>
      <%= render partial: 'project', collection: @projects, as: :project %>
    <% end %>
  </div>
<% end %>
